<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://module.nado.com/pagination/taglibs" prefix="pagination" %>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript">

$(document).ready(function(){
	
	$("#progressYn").click(function(){
		var progressYn = $(this).is(":checked") ? "Y" : "N";
		enco.log("progressYn is " + progressYn);
		$(this).val(progressYn);
		
		document.forms[0].submit();
	});
	
	$("#bigImage").dialog({
		autoOpen: false,
		bgiframe: true,
		overlay: { opacity: 0.3, background: "white" },
		width: 'auto',
		modal: true,
	});
});

function doDetail(bnnrNo) 
{
	$("#" + bnnrNo).toggle();
}

function doProgressSearch() 
{
	var progressYn = $("#progressYn").is(":checked") ? "Y" : "N";
	enco.log("progressYn is " + progressYn);
	$("#progressYn").val(progressYn);
	
	document.forms[0].submit();
}

function onSelectedTab(thmNo)
{
	$(".tab2 li").each(function(i) {
		$(".tab2 li:eq(" + i + ")").removeClass();
		$("#progressYn").attr("checked", "");
		$("#bnnrThmSeq").val(thmNo);
		
		document.forms[0].submit();
	});
}

function showImage(image) 
{
	$("#bigImage").html('<img src="'+image+'">');
	setTimeout(function(){$("#bigImage").dialog("open");}, 100);
}
</script>
</head>

<body>
<form:form action="/service/banner" method="get">
<input type="hidden" id="bnnrThmSeq" name="bnnrThmSeq" value="${bnnrThmSeq}"/>
<div class="content_top">
	<p class="path">
		<strong>홍보영역관리</strong>
	</p>
</div>

<div class="tab2">
	<ul>
	<c:forEach items="${bnnrThmList}" var="bnnrThm" varStatus="step">
		<li <c:if test="${bnnrThm.bnnrThemaNo eq bnnrThmSeq}"> class="on"</c:if>>
			<a href="#" onclick="onSelectedTab(${bnnrThm.bnnrThemaNo});">${bnnrThm.bnnrTypeNm}${bnnrThm.bnnrLocaTpNm}</a>
		</li>
	</c:forEach>	
	</ul>
</div>
<br>

<div class="div_left">
Total : <b id="total">${bnnrCount}</b> 건
</div>
<div class="div_right">
	<input type="checkbox" id="progressYn" name="progressYn" <c:if test="${progressYn eq 'Y'}">checked="checked"</c:if>>&nbsp;진행중인 배너만 보기
	<a href="/service/banner/form/${bnnrThmSeq}" class="btn_sml"><span>홍보영역등록</span></a>
	<a href="javascript:;" class="btn_sml"><span>노출 순위 설정</span></a>
</div>
<br>
<br>

<div class="tbl_type1">
	<table cellspacing="0" border="1">
		<col width="50">
		<col>
		<col width="85">
		<col width="85">
		<col width="85">
		<col width="85">
		<col width="40">
		
		<thead>
		<tr>
			<th>번호</th>
			<th>제목</th>
			<th>노출기간</th>
			<th>노출상태</th>
			<th>등록일시</th>
			<th>등록자</th>
			<th></th>
		</tr>
		</thead>
		
		<tbody>
		<c:forEach items="${bnnrList}" var="item">
		<fmt:parseDate var="registDate" value="${item.lastDate}" pattern="yyyy-MM-dd"/>
		<tr>
			<td align="center">${item.bannerNo}</td>
			<td><a href="#" onclick="doDetail(${item.bannerNo});">${item.title}</a></td>
			<td align="center">${item.expDay}</td>
			<td align="center">${item.expStatusNm}</td>
			<td align="center"><fmt:formatDate value="${registDate}" pattern="yyyy-MM-dd"/></td>
			<td align="center">${item.userId}</td>
			<td></td>
		</tr>
		<tr id="${item.bannerNo}" style="display: none;">
			<td colspan="7">
				<div class="tbl_type3"> 
					<table cellspacing="0" border="1">
					<col width="120">
					<col>
					<col width="120">
					<col>
					<tr><th>배너구분</th><td colspan="3">${item.bnnrLocaTpCd}</td></tr>
					<tr><th>배너제목</th><td>[${item.bannerNo}] ${item.title}</td><th>배너순번</th><td>${item.order}</td></tr>
					<tr>
					<th>배너내용</th>
					<td class="inner_tbl_type1" colspan="3">
					<c:choose>
						<c:when test="${fn:endsWith(item.bnnrLocaTpCd, '_H') eq true}">
						<textarea rows="10" cols="10" class="input_txt" readonly="readonly" style="height:150px; width:95%">${item.contents}</textarea>							
						</c:when>
						<c:otherwise>
						${item.contents}
						<h4>이미지를 클릭하면 크게 볼수 있습니다.</h4>
						<a href="#" onclick="showImage('${item.contents}');"><img src="${item.contents}" width="550"></a>
						</c:otherwise>
					</c:choose>
					</td>
					</tr>
					<tr>
					<th>외부링크</th>
					<td class="inner_tbl_type1" colspan="3">
						<table cellspacing="0" border="1" class="inner_tbl_y">
						<col width="85">
						<col>
						<tr><th>링크형태</th><td>[${item.linkExpTypeCd}] ${item.linkExpTypeNm}</td></tr>
						<tr><th>링크주소</th><td>${item.expLinkUrl}</td></tr>
						</table>
					</td>
					</tr>
					<tr><th>노출일</th><td>[${item.expStatusNm}] ${item.expDay}</td><th>노출기간</th><td>${item.expStartDate} ~ ${item.expEndDate}</td></tr>
					<tr><th>등록자</th><td>${item.userId}</td><th>등록일시</th><td>${item.lastDate}</td></tr>
					</table>
				</div>
				<br>
			</td>
		</tr>
		</c:forEach>
		<c:if test="${empty bnnrList}">
		<tr>
			<td colspan="7" align="center">검색된 데이터가 없습니다.</td>
		</tr>
		</c:if>
		</tbody>
	</table>
</div>

<div id="paginate" class="paginate">
	<pagination:paginate paginationInfo="${paginate}"/>
</div>

<div id="bigImage" title="Image"></div>

</form:form>
</body>
</html>